<!-- StudyWebBaiDuDoc.html -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>百度文档</title>
		<style type="text/css">
			html,body{
				margin: 0;
				padding: 0;
				background-color: black;
				height: 100%;
				width: 100%;
			}
			#reader{
				width: 100%;
				height: 100%;
			}
		</style>
	</head>
	<body>
		<div id="reader"></div>
	</body>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/jquery.min.js"></script>
	<script type="text/javascript" src="../../script/doc_reader_v2.js"></script>
	<!-- <script src="http://static.bcedocument.com/reader/v2/doc_reader_v2.js"></script> -->
	<script type="text/javascript" >
		var pn = 1;//默认第一页
		apiready = function(){
			setupFrameRect();
			setupDoc();
			setupScreenNotifi();
		}
		function setupScreenNotifi(){
			window.addEventListener("orientationchange", function() {
				setTimeout(function(){
					$('#reader').html('');
					setupFrameRect();
					setupDoc();
				}, 500);
			}, false);
		}
		function setupFrameRect(){
			if (api.winWidth > api.winHeight) {//横屏
				api.sendEvent({
				    name: 'webBaiDuScreenChangeNotifi',
				    extra: { 
				        isHScreen: true
				    }
				});
				var width = $('#reader').width() - 120;
				var height = $('#reader').height();
				api.setFrameAttr({
				    name: 'StudyWebBaiDuDoc',
				    rect: {
				        x: 60,
				        y: -70,
				        w: width,
				        h: height
				    }
				});
			}else{
				api.sendEvent({
				    name: 'webBaiDuScreenChangeNotifi',
				    extra: { 
				        isHScreen: false
				    }
				});
				api.setFrameAttr({
				    name: 'StudyWebBaiDuDoc',
				    rect: {
				        x: 0,
				        y: 66,
				        w: 'auto',
				        h: 'auto'
				    }
				});
			}
		}
		function setupDoc(){
			var option = {
		        docId: api.pageParam.docId,
		        token: 'TOKEN',
		        host: 'BCEDOC',
		        serverHost: 'http://doc.bj.baidubce.com',
		        width: 500, //文档容器宽度
		        zoom: false,//是否显示放大缩小按钮
		        zoomStepWidth:200,
		        pn: pn,  //定位到第几页，可选
		        ready: function (handler) {  // 设置字体大小和颜色, 背景颜色（可设置白天黑夜模式）
		            handler.setFontSize(1);
		            handler.setBackgroundColor('#000');
		            handler.setFontColor('#fff');
		        },
		        flip: function (data) {    // 翻页时回调函数, 可供客户进行统计等
		            // console.log(data.pn);
		            pn = data.pn;
		        },
		        fontSize:'big',
		        toolbarConf: {
	                page: true, //上下翻页箭头图标
	                pagenum: true, //几分之几页
	                full: false, //是否显示全屏图标,点击后全屏
	                copy: true, //是否可以复制文档内容
	                position: 'center'// 设置 toolbar中翻页和放大图标的位置(值有left/center)
		        } //文档顶部工具条配置对象,必选
		    };
		    new Document('reader', option);
		}
	</script>
</html>